<template>
    <el-main>
        <el-form ref="form" :model="form" label-width="80px" size="mini" label-position="left">
            <el-form-item label="积分比" v-qx="quanxian.jifen">
                <el-input v-model="form.jifenpercent" placeholder="积分获取比例（0-1）"></el-input>
            </el-form-item>
            <el-form-item label="充值比" v-qx="quanxian.chongzhi">
                <el-input v-model="form.chongzhipercent" placeholder="充值提成比例（0-1）"></el-input>
            </el-form-item>
            <el-form-item label="开卡比" v-qx="quanxian.kaika">
                <el-input v-model="form.kaikapercent" placeholder="开卡提成比例（0-1）"></el-input>
            </el-form-item>
            <el-form-item label="阶梯提成">
                <el-radio-group v-model="form.isticheng">
                    <el-radio :label="0">关闭</el-radio>
                    <el-radio :label="1">开启</el-radio>
                </el-radio-group>
            </el-form-item>
            <div style="display: flex;margin-bottom: 18px;" v-show="form.isticheng">
                <label style="width: 80px;flex-shrink: 0;">
                  <el-button type="primary" size="mini" icon="el-icon-plus" @click="addRow">添加</el-button>
                </label>
                <div>
                  <div style="display: flex; margin: 5px 0" v-for="(item, key) in form.tichengarr">
                    <el-select placeholder="请选择" v-model="item.timetype" size="mini" style="width: 100px;flex-shrink: 0;">
                      <el-option key="1" label="年度累计" :value="1"></el-option>
                      <el-option key="2" label="本月累计" :value="2"></el-option>
                      <el-option key="3" label="当天累计" :value="3"></el-option>   
                    </el-select>
                    <el-select placeholder="业绩类型" v-model="item.feattype" size="mini" style="width: 100px;flex-shrink: 0;">
                      <el-option key="1" label="现金业绩" :value="1"></el-option>
                      <el-option key="2" label="卡耗业绩" :value="2"></el-option>
                    </el-select>
                    <el-input placeholder="请输入业绩量" size="mini" v-model="item.feet"></el-input>
                    <el-input placeholder="浮动提成比（0-100）%" size="mini" v-model="item.percent"></el-input>
                    <el-button type="danger" size="mini" icon="el-icon-delete" @click="deleterow(key)"></el-button>
                  </div>
                </div>
            </div>
            <el-form-item label="欠款设置">
                <el-radio-group v-model="form.isqian">
                    <el-radio :label="0">不能欠款</el-radio>
                    <el-radio :label="1">可以欠款</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item>
                <!-- <el-form-item label="产品设置">
          <el-radio-group v-model="form.shopaddgoods">
            <el-radio :label="0">分店不能创建产品</el-radio>
            <el-radio :label="1">分店可以创建产品</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item> -->
                <el-button type="primary" size="mini" @click="onSubmit">保存</el-button>
                <el-button size="mini" @click="close">关闭</el-button>
            </el-form-item>
        </el-form>
    </el-main>   
</template>
<script>
import C from '@/common/common.js'
import Setting from '@/service/shop/setting.js'
export default {
  name: 'index',
  data () {
    return {
      form: {
        jifenpercent: '',
        chongzhipercent: '',
        kaikapercent: '',
        shopaddgoods: '',
        isqian: 0,
        isticheng: 0,
        tichengarr: []
      },
      quanxian: {
        jifen: 'richang_jifen',
        chongzhi: 'richang_chongzhi',
        kaika: 'richang_kaika'
      }
    }
  },
  methods: {
    async onSubmit () {
      if (!/^(1|0|0\.\d+)$/.test(this.form.jifenpercent)) {
        C.error('积分比设置不正确!')
        return false
      }
      if (!/^(1|0|0\.\d+)$/.test(this.form.chongzhipercent)) {
        C.error('充值比设置不正确!')
        return false
      }
      if (!/^(1|0|0\.\d+)$/.test(this.form.kaikapercent)) {
        C.error('开卡比设置不正确!')
        return false
      }
      let res = await Setting.setSetting(this.form)
      if (res) {
        C.success(res.data)
        // 更新缓存
        C.setLocalStorage('initConfig', JSON.stringify(this.form))
      }
    },
    close () {
      C.closeBrowserWindow()
    },
    async getSetting () {
      this.form = Object.assign({}, this.form, await Setting.getSetting())
    },
    addRow () {
      console.log(this.form)
      this.form.tichengarr.push({
        timetype: 3,
        feet: '',
        percent: ''
      })
    },
    deleterow (key) {
      this.form.tichengarr.splice(key, 1)
    }
  },
  mounted: function () {
    this.getSetting()
  }
}
</script>
<style>
</style>